const pxtorem = require('postcss-pxtorem')

module.exports = {
  // 在开发环境下，如果想把开发服务器架设在根路径，可以使用一个条件式的值
  // publicPath: process.env.NODE_ENV === 'production' ? 'production-sub-path' : '/',
  // 部署应用时的基本 URL
  publicPath: process.env.NODE_ENV === 'production' ? '192.168.60.110:8080' : '192.168.60.110:8080',
  // 打包位置
  outputDir: 'dist',
  // 静态资源位置
  assets: 'assets',
  indexPath: 'index.html',
  // 默认在生成的静态资源文件名中包含hash以控制缓存
  filenameHashing: true,
  // eslint代码检测(是否开启代码保存检测)： true | false | 'error'
  // 设置为 true 时，eslint-loader 会将 lint 错误输出为编译警告。默认情况下，警告仅仅会被输出到命令行，且不会使得编译失败
  // 希望让 lint 错误在开发时直接显示在浏览器中，可以使用 lintOnSave: 'error'。这会强制 eslint-loader 将 lint 错误输出为编译错误
  eslint:
  // webpack-dev-server 相关配置
  devServer: {
    // 设置自动打开
    open: true,
    // 地址
    host: 'localhost',
    // 端口
    port: 1234,
    // 代理配置
    proxy: {
      '/api': {
        // 代理目标地址
        target: 'http://rap2api.taobao.org/app/mock/270263/',
        // （建立长连接）如果需要代理webSockets, 配置这个参数
        ws: true,
        // （是否跨域）changeOrigin默认是false：请求头中host仍然是浏览器发送过来的host，如果设置为true， 请求头中host会设置成为target
        changeOrigin: true,
        // 接口重写，告诉node我们需要代理的接口地址以 '/api' 开头的，如果最后需要代理的地址是以 'http://xxx.xxx.com/api', 用 '^api/: /' 把api去掉
        pathRewrite: {
          '^/api': '/'
        }
      }
    }
  },
  // css处理
   css: {
     // 默认为false, css文件名可以被忽略
     module: true,
     // 是否将组件中的 CSS 提取至一个独立的 CSS 文件中,当作为一个库构建时，你也可以将其设置为 false 免得用户自己导入 CSS
     // 默认生产环境是true，开发环境是fasle
     extract: false,
     // 是否开启 source Map 模式，为true可能会影响性能
     sourceMap: false,
     // css预设器设置
      loaderOptions: {
        postcss: {
          plugins: [
            pxtorem({
              rootValue: 75,
              propList: ['*', '!font*'],
              selectorBlackList: ['van']
            })
          ]
        }
      }
    },


  // 是否使用包含运行时编译器的 Vue 构建版本
  runtimeCompiler: false,
  // Babel 显式转译列表
  transpileDependencies: [],

  // 如果你不需要生产环境的 source map，可以将其设置为 false 以加速生产环境构建
  productionSourceMap: true,

  // 设置生成的 HTML 中 <link rel="stylesheet"> 和 <script> 标签的 crossorigin 属性（注：仅影响构建时注入的标签）
  crossorigin: '',

  // 在生成的 HTML 中的 <link rel="stylesheet"> 和 <script> 标签上启用 Subresource Integrity (SRI)
  integrity: false,

  // 如果这个值是一个对象，则会通过 webpack-merge 合并到最终的配置中
  // 如果你需要基于环境有条件地配置行为，或者想要直接修改配置，那就换成一个函数 (该函数会在环境变量被设置之后懒执行)。该方法的第一个参数会收到已经解析好的配置。在函数内，你可以直接修改配置，或者返回一个将会被合并的对象
  configureWebpack: {},

  // 对内部的 webpack 配置（比如修改、增加Loader选项）(链式操作)
  chainWebpack: () =>{

  },
  // 可以用来传递任何第三方插件选项
  pluginOptions: {}
}
